:root {
	--col_background: snow;
	--col_contrast: #161616;
	--col_text: #161616;
	--col_headers: #8aca1d;
	--col_links: #323629;
	--col_linkhover: snow;
	--col_logos: #beef69;
}

@media (prefers-color-scheme: dark) {
:root {
	--col_background: #161616;
	--col_text: snow;
	--col_contrast: snow;
	--col_headers: #8aca1d;
	--col_links: #8aca1d;
	--col_linkhover: #8aca1d;
	--col_logos: #beef69;
	}
}

body {
	background-color: var(--col_background);
	font-family: monospace;
	font-size: 0.9rem; 
	color: var(--col_text);
	max-width: 68rem;
	margin: auto;
	}

header, section, footer, .subsection {
	border: 3px solid var(--col_text);
	padding: 1em;
	margin: 1em;
}

footer {
	text-align: center;
	}

blockquote {
	background-color: var(--col_contrast);
	color: var(--col_background);
	box-shadow: 5px 5px var(--col_headers);
	margin: 2em 1em 1em 1em;
	padding: 1em;
	margin: 0.5em 0.2em;
	font-family: monospace;
	transform: rotate(2deg);
	transform-origin: bottom right;
	}

nav {
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
	align-items: center;
	align-content: center;
	gap: 1em;
	
	/* text-align: center;
	margin-bottom: 1.3em; */
	}

nav a {
	color: var(--col_contrast);
	padding: .5em;
	border: 2px solid var(--col_contrast);
	box-shadow: 3px 3px var(--col_contrast);
	}

nav a:hover {
	background-color: var(--col_contrast);
	color: var(--col_linkhover);
	font-weight: bold;
	text-transform: uppercase;
	box-shadow: 3px 3px var(--col_headers);
	cursor: crosshair;
	}

a {
	color: var(--col_links);
	text-decoration: underline;
}

a:hover {
    background-color: var(--col_headers);
    color: var(--col_linkhover);
    font-weight: bold;
    text-decoration: none;
    text-transform: uppercase;
}

header h1 {
	font-size: 2.5em;
	}
header p {
	text-align: center;
	}

h1 {
	letter-spacing: .3em;
	text-align: center;
	margin-bottom: 1em;
	color: var(--col_headers);
	text-transform: uppercase;
	text-shadow: 3px 3px var(--col_contrast);
	}

h2 {
	width: fit-content;
	text-transform: uppercase;
	text-align: center;
	margin-bottom: .5em;
	padding: 0.2em 1em;
	box-shadow: 3px 3px var(--col_contrast);
	background-color: var(--col_headers);
	}

h3 {
	width: fit-content;
	margin-bottom: .5em;
	background-color: var(--col_headers);
	text-align: center;
	padding: 0.2em 1em;
	text-transform: uppercase;
	box-shadow: 3px 3px var(--col_contrast);
}

p {
    margin: .5em 0;
}

/* added */
.eggmilk {
	display: flex;
	flex-flow: column wrap;
	justify-content: flex-start;
}

@media (max-width: 600px) {
	nav ul li {
		line-height: 3em;
		}
	}

@media (min-width: 800px) {
	body { font-size: 1rem; } 
	.eggmilk {
		flex-wrap: row nowrap;
		}
	}